import React, { useEffect, useState } from "react";
import Navbar from "../../compoents/Navbar";
import { useNavigate } from "react-router-dom";
import { SearchBar, List } from "antd-mobile";
import style from "./index.module.css";
import request from "../../api/request";
function Index() {
  const navigate = useNavigate();

  const [orderList, setOrderList] = useState<any[]>([]);

  const getOrderList = async () => {
    const res = await request.get("/api/order");
    console.log("挂号数据", res);
    if (res.code === 20000) {
      setOrderList(res.data);
    }
  };

  useEffect(() => {
    getOrderList();
  }, []);
  return (
    <div>
      <Navbar showBack title="挂号" onBack={() => navigate(-1)} />
      <div className={style.searchBox}>
        <SearchBar
          className={style.search}
          placeholder="搜索医院、科室、医生"
        />

        <h4 className={style.hotTitle}>热门推荐</h4>

        <List>
          {orderList.length > 0 &&
            orderList.map((item, index) => (
              <List.Item key={index} >
                {item.sococity}
              </List.Item>
            ))}
        </List>
      </div>
    </div>
  );
}

export default Index;
